@keyframes mymove
{
	from{width:0px;}
	to{width:180px;}
}

.menu{
    background-color: #001529;
    width: 180px; 
    height: 690px; 
    padding-top: 15px;

    &_side{
        padding: 4px 0 5px 0;

        &_margin{
            width:180px;
	        height:40px;
            position:relative;
        }

        &_margin:hover .menu_side_item{
            background:#4abac4;
            color: #fff;
            animation:mymove 0.3s linear;
        }

        &_center{
            width:180px;
            height:40px;
            background: #000c17;
            position:relative;
        }

        &_center:hover .menu_side_item{
            background:#4abac4;
            color: #fff;
            animation:mymove 0.3s linear;
        }

        &_item{
            width:180px;
            height:40px;
            position:relative;
            
            &_border{
                width:180px; 
                padding: 9px 0 9px 24px;
            }

            &_icon{
                width: 14px;
                height: 14px;
                fill: #999;
                float: left;
                margin-top: 4px;
                margin-right: 7px;
            }
      
            &_center{
                margin: 2px 0 2px 0;
                width:180px; 
                padding: 8px 0 9px 40px;
            }
      
            &_text{
                float: left;
                width: 100px;
            }
        }
      
        &_itemfocus{
            width:180px;
            height:40px;
            color: #fff;
            position:relative;
            background:#4abac4;
        }

        &_font{
            padding-left: 24px; 
            padding: 9px 0 9px 24px; 
        }
      
        &_font:hover{
            color: #fff;
        }
    }
  
}